<!DOCTYPE html>
<html lang="en"
        xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="https://www.thymeleaf.org/thymeleaf-extras-springsecurity6">

<head>
    <meta charset="UTF-8">
    <title>List Users</title>
    <link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}" />
    <script type="text/javascript" th:src="@{/webjars/jquery/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
</head>
<body>
<div class="container text-center">

    <div class="col-md-6 col-md-offset-3">
        <img th:src="@{/gzasc_logo.png}" alt="Sample Image"/>
    </div>

    <div>
        <form th:action="@{/logout}" method="post">
            <p>
                Welcome <b><span sec:authentication="principal.fullName"></span></b>
            </p>
            <input type="submit" value="退出" />
        </form>
    </div>
    <div>
        <h1>用户列表</h1>
    </div>

    <div>
        <table class="table table-striped table-bordered">
            <thead class="thead-dark">
            <tr>
                <th>用户 ID</th>
                <th>邮件地址</th>
                <th>用户姓名</th>
                <th>电话号码</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="user: ${listUsers}">
                <td th:text="${user.id}">User ID</td>
                <td th:text="${user.email}">E-mail</td>
                <td th:text="${user.userName}">First Name</td>
                <td th:text="${user.phone}">Last Name</td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>